<template>
  <!-- 页面-系统配置-值维护 -->
  <div class="item innerPageTable-box-OneTwo ConfigItemManage-page innerPageTable-out-flex">
    <SelfAdaption>
      <Form
        :model="searchForm"
        ref="searchForm"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom hierarchyValue"
        inline
      >
        <!-- 参数编码 -->
        <Form-item prop="groupCode" :label="$t('module.configManage.parameterCode')">
          <Input type="text" :maxlength="30" v-model="configInfo.code" disabled/>
        </Form-item>

        <!-- 参数名称 -->
        <Form-item prop="groupName" :label="$t('module.configManage.parameterName')">
          <Input type="text" :maxlength="30" v-model="configInfo.name" disabled />
        </Form-item>
      </Form>
    </SelfAdaption>
    <!-- 搜索区域 -->
    <SelfAdaption>
      <Form
        :model="searchForm"
        ref="searchForm"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom hierarchyValue"
        inline
      >
        <!-- 配置层级 -->
        <Form-item
          v-if="isShowNew"
          prop="scopeLevel"
          :label="$t('module.configManage.configHierarchy')"
        >
          <Select
            v-model="searchForm.scopeLevel"
            style="width:100%"
            :placeholder="$t('module.configManage.enterconfigHierarchy')"
            clearable
          >
            <Option
              v-for="item in searchConfigItemManageList"
              :value="item.vsiKey"
              :key="item.vsiKey"
            >{{ item.vsiValue }}</Option>
          </Select>
        </Form-item>
        <!-- 层级值 -->
        <Form-item
          v-if="isShowNew"
          prop="scopeContextName"
          :label="$t('module.configManage.hierarchyValue')"
        >
          <Input
            v-model.trim="searchForm.scopeContextName"
            type="text"
            :maxlength="30"
            :placeholder="$t('module.configManage.enterHierarchyValue')"
            @on-enter="search"
          />
        </Form-item>
        <!-- 参数值 -->
        <Form-item v-if="isShowNew" prop="value" :label="$t('module.configManage.parameter')">
          <Input
            v-model.trim="searchForm.value"
            type="text"
            :maxlength="30"
            :placeholder="$t('module.configManage.enterparameter')"
            @on-enter="search"
          />
        </Form-item>
        <!-- 查询\重置按钮 -->
        <Form-item v-if="isShowNew" prop="button" class="search-solt-btn">
          <RPButton optType="search" @click="search" />
          <RPButton optType="reset" @click="reset" />
        </Form-item>
      </Form>
    </SelfAdaption>

    <div class="inner-page-table-out">
      <InnerPageTable ref="configItemManage" :config="tableConfig">
        <div slot="table-bar">
          <RPButton optType="create" @click="add" />
        </div>
      </InnerPageTable>
    </div>
  </div>
</template>
<script>
import { findConfigValuePage, deleteConfigValue, findItemConfigPage } from "@/api/configApi.js";
import valueSetAPI from "@/api/valueSetAPI.js";
import { configItemColumn } from "./columns.js";
import locales from "./locales.js";
import ConfigItemEdit from "./EditItemConfig";
import { CONFIG_LEVEL_GLOBAL, CONFIG_LEVEL_TENANT, CONFIG_LEVEL_ROLE, CONFIG_LEVEL_USER } from "./const.js";

export default {
  name: "configitemmanage",
  mixins: [locales],
  props: {
    tenantCode: {
      type: String,
      default: ""
    },
    configItemId: {
      type: String,
      default: ""
    },
    tenantName: {
      type: String,
      default: ""
    },
    configInfo: {
      type: Object,
      default: () => ({})
    },
    isRIPPLES: {
      type: Boolean,
      default: () => ({})
    }
  },
  data() {
    return {
      owners: [],
      searchConfigItemManageList: [
        {
          vsiKey: "0",
          vsiValue: this.$t("module.configManage.platformDefault")
        },
        {
          vsiKey: "1",
          vsiValue: this.$t("common.tenant")
        },
        {
          vsiKey: "2",
          vsiValue: this.$t("common.role")
        },
        {
          vsiKey: "3",
          vsiValue: this.$t("common.user")
        }
      ],
      // configLevelList: [
      //   {
      //     key: CONFIG_LEVEL_GLOBAL,
      //     value: "全局"
      //   },
      //   {
      //     key: CONFIG_LEVEL_TENANT,
      //     value: "租户"
      //   },
      //   {
      //     key: CONFIG_LEVEL_ROLE,
      //     value: "角色"
      //   },
      //   {
      //     key: CONFIG_LEVEL_USER,
      //     value: "用户"
      //   }
      // ]
      isShowNew: this.tenantCode != window.RPConfig.rootTenantCode,
      searchForm: {
        scopeLevel: "null", //配置层级
        scopeContextName: null, //层级对象
        value: null, //参数值
        configItemId: this.configItemId
      },
      scopeLevelNum: null
    };
  },
  computed: {
    tableConfig() {
      const vm = this;
      return {
        loadDataFn: findConfigValuePage,
        columnsFn: configItemColumn.bind(this),
        autoFirst: false,
        rowClassNameFn: this.rowClassName, // 自定义行样式
        autoMaxHeight: false
      };
    },
    configLevelList() {
      return [
        {
          key: CONFIG_LEVEL_GLOBAL,
          value: this.$t("module.configManage.platformDefault")
        },
        {
          key: CONFIG_LEVEL_TENANT,
          value: this.$t("module.configManage.tenement")
        },
        {
          key: CONFIG_LEVEL_ROLE,
          value: this.$t("module.configManage.role")
        },
        {
          key: CONFIG_LEVEL_USER,
          value: this.$t("module.configManage.user")
        }
      ];
    }
  },
  created() {
    this.init();
  },
  mounted() {
    this.search();
    this.searchGroupItems();
  },
  methods: {
    init() {
      if (this.configInfo.valueSetCode) {
        valueSetAPI.getValueSetByCode(this.configInfo.valueSetCode).then(data => {
          this.owners = data;
        });
      }
    },
    // 自定义行样式
    rowClassName(row) {
      this.scopeLevelNum = row.scopeLevel;
      if (this.tenantCode == window.RPConfig.rootTenantCode) {
        if (row.vsItemEnabled == 0) {
          return "tableDisableStyle";
        }
      }
    },
    processTableData(tableCom, res) {
      tableCom.currentPage = res.currentPage || res.pageNum || 1;
      tableCom.total = res.recordCount || res.total || 0;
      const items = res.recordList || res.records || res || [];
      tableCom.tableData = items;
      this.allItems = items;
    },
    searchGroupItems(page) {
      this.$refs["configItemManage"].load({ itemCode: this.configInfo.code, configItemId: this.configItemId }, page);
    },
    commonModal(props) {
      new this.$pageModal(
        ConfigItemEdit,
        {
          props: props
        },
        data => {
          data && this.searchGroupItems();
        }
      );
    },
    search(page = 1) {
      let searchForms = Object.assign({}, this.searchForm);
      if (searchForms.scopeLevel == "null") {
        searchForms.scopeLevel = null;
      }
      this.$refs["configItemManage"].load(searchForms, page);
    },
    reset() {
      this.$refs["searchForm"].resetFields();
      this.search(1);
    },
    add() {
      this.commonModal({
        tenantCode: this.tenantCode,
        tenantName: this.tenantName,
        configItemId: this.configItemId,
        allItems: this.allItems,
        parentItem: this.configInfo,
        // owners: this.owners,
        isRIPPLES: this.isRIPPLES,
        configInfo: this.configInfo,
        scopeLevelNum: this.scopeLevelNum
      });
    },
    edit(configValue) {
      this.commonModal({
        tenantCode: this.tenantCode,
        configItemId: this.configItemId,
        // allItems: this.allItems.filter(item => item.itemCode !== configValue.itemCode || item.owner !== configValue.owner),
        valueId: configValue.id,
        parentItem: this.configInfo,
        // owners: this.owners,
        tenantName: this.tenantName,
        scopeLevel: configValue.scopeLevel,
        configValue
      });
    },
    delete(id) {
      let arr = [];
      arr.push(id);
      new $confirm(this.$t("module.flexField.warning.confirmToDelete"), this).then(() => {
        deleteConfigValue(arr).then(res => {
          if (res.data) {
            this.$message.success({
              content: this.$t("common.deleteSuccess"),
              duration: 3
            });
            this.searchGroupItems();
            return;
          }
          this.$message.error({
            content: res.msg || "Delete Failed!",
            duration: 3
          });
        });
      });
    },
    getLevelName(scopeLevel) {
      let obj = this.configLevelList.find(level => {
        return level.key == scopeLevel;
      });
      return obj ? obj.value : scopeLevel;
    }
  }
};
const fib = [];
</script> 
<style lang="less">
.hierarchyValue {
  .ivu-form-item-label {
    width: 86px;
  }
}
</style>